<template>
  <van-tabbar v-model="tabActive">
    <template v-for="item in footerList">
      <van-tabbar-item :key="item.code" :icon="item.icon" :name="item.code" @click="tabbarChange(item)">
        {{ item.name }}
      </van-tabbar-item>
    </template>
  </van-tabbar>
</template>
<script>
export default {
  data() {
    return {
      tabActive: 'Home',
      // 底部导航列表
      footerList: [
        {
          code: 'Home',
          name: '首页',
          icon: '',
          iconType: '', // 不为空时选择选中的图标类型
          path: '/home/:id/info'
        },
        {
          code: 'MyCenter',
          name: '我的',
          icon: '',
          iconType: '', // other 其他图标引入方式
          path: '/myCenter'
        }
      ]
    };
  },
  created() {
    const id = this.$route.params.id;
    this.gameId = id;
    this.tabActive = this.$route.meta.activeMenu || this.$route.name;
  },
  methods: {
    tabbarChange(routerInfo) {
      this.$router.push({
        name: routerInfo.code + (this.gameId && 'Game' || '')
      });
    }
  }
};
</script>
